{include file="common/header"}
<div id="app" v-cloak>
    <div class="el-pane-warp">
		<el-form :model="config" :rules="configRules" ref="config" label-width="100px" style="background-color: #fff;padding: 20px;">
			<el-form-item label="APPID" prop="app_id">
				<el-input v-model="config.app_id" type="password" show-password></el-input>
				应用ID,您的APPID。
			</el-form-item>
			<el-form-item label="商户私钥" prop="merchant_private_key">
				<el-input type="textarea" :rows="4" v-model="config.merchant_private_key"></el-input>
				商户私钥，您的原始格式RSA私钥。
			</el-form-item>
			<el-form-item label="支付宝公钥" prop="alipay_public_key">
				<el-input type="textarea" :rows="4" v-model="config.alipay_public_key"></el-input>
				支付宝公钥,查看地址：
				<a href="https://openhome.alipay.com/platform/keyManage.htm" target="_blank">点击获取</a> 对应APPID下的支付宝公钥。
			</el-form-item>
			<el-form-item label="开启状态" prop="open">
				<el-switch
					v-model="config.open"
					active-color="#13ce66"
					inactive-color="#ff4949"
					:active-value="1"
					:inactive-value="0">
				</el-switch>
			</el-form-item>
			<el-form-item v-if="qrCode != ''" label="支付二维码：">
				<div class="image" v-html="qrCode"></div>
			</el-form-item>
		</el-form>
		<div class="el-bottom">
			<el-button size="medium" type="primary" @click="submit" :loading="loading">保 存</el-button>
			<el-button size="medium" type="warning" @click="test" :loading="qrcodeLoading">测 试</el-button>
		</div>
	</div>
</div>
<script>
	new Vue({
	    el: '#app',
	    data() {
	        return {
	        	url: 'pay/config/alipay',
	        	testUrl: 'pay/test/alipay',
	        	qrCode: "",
	        	qrcodeLoading: false,
	            config: {:json_encode($config)},
	            loading: false,
	            configRules: {
	                app_id: [
	                    { required: true, message: '请输入您的APPID', trigger: 'blur' },
	                ],
	                merchant_private_key: [
	                    { required: true, message: '请输入您的商户私钥', trigger: 'blur' },
	                ],
	                alipay_public_key: [
	                    { required: true, message: '请输入您的支付宝公钥', trigger: 'blur' },
	                ],
	                open: [
	                    { required: true, message: '请输入', trigger: 'blur' },
	                ],
	            },
	        }
	    },
	    methods: {
	    	/**
	    	 * 提交
	    	 */
	    	submit() {
	    		let self = this;
	            self.$refs.config.validate((valid) => {
	                if (valid) {
	                    self.loading = true;
	                    request.post(self.url, {config: self.config}, function(res){
	                        self.loading = false;
	                        self.$notify({ showClose: true, message: res.message, type: res.status});
	                    });
	                } else {
	                    return false;
	                }
	            });
	    	},
	    	/**
	    	 * 测试
	    	 */
	    	test() {
	    		let self = this;
	    		self.qrcodeLoading = true;
	    		request.post(self.testUrl, {}, function(res) {
	                if (res.status === 'success') {
	                    self.qrCode = res.data;
	                } else {
	                    self.$notify({ showClose: true, message: res.message, type: res.status});
	                }
	                self.qrcodeLoading = false;
	            });
	    	},
	    }
	})
</script>
{include file="common/footer"}